<template>
	<view class="content">
		<view class="content_time">
			{{itemSystem.datetime}}
		</view>
		<view class="u-flex u-row-center">
			<view class="content_inner">
				{{itemSystem.message}}
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		watch
	} from 'vue'
	const itemSystem = ref({})
	const props = defineProps({
		itemSystem: Object
	})
	watch(()=> props.itemSystem,(nv)=>{
		itemSystem.value = nv
	},{
		immediate:true,
		deep:true
	})
</script>

<style lang="scss" scoped>
	.content {
		margin-bottom: 60rpx;
		&_time {
			text-align: center;
			margin: 46rpx 0 28rpx 0;
			color: #999999;
			font-size: 24rpx;
		}
		&_inner {
			background: #CBCBCB;
			font-size: 26rpx;
			color: #FFFFFF;
			padding: 16rpx 30rpx;
			border-radius: 60rpx;
		}
	}
</style>